import type { FC } from 'react'
import QuestionInputConfig, { QuestionInputPropsType } from './QuestionInput'
import QuestionTitleConfig, { QuestionTitlePropsType } from './QuestionTitle'
import ComponentParagraphConfig, { QuestionParagraphPropsType } from './QuestionParagraph'
import ComponentInfoConfig, { QuestionInfoPropsType } from './QuestionInfo'
import ComponentTextAreaConfig, { QuestionTextAreaPropsType } from './QuestionTextArea'
import ComponentRadioConfig, {
    QuestionRadioPropsType,
    QuestionRadioStatPropsType,
} from './QuestionRadio'
import ComponentCheckboxConfig, {
    QuestionCheckboxPropsType,
    QuestionCheckboxStatPropsType,
} from './QuestionCheckbox'

// 统一，各个组件的统计属性类型
type ComponentStatPropsType = QuestionRadioStatPropsType & QuestionCheckboxStatPropsType

// 统一的：各个组件的 props type
export type ComponentPropsType = QuestionInputPropsType &
    QuestionTitlePropsType &
    QuestionParagraphPropsType &
    QuestionInfoPropsType &
    QuestionTextAreaPropsType &
    QuestionRadioPropsType &
    QuestionCheckboxPropsType

// 组件的配置
export type ComponentConfigType = {
    title: string
    type: string
    Component: FC<ComponentPropsType>
    PropComponent: FC<ComponentPropsType>
    defaultProps: ComponentPropsType
    StatComponent?: FC<ComponentStatPropsType>
}

// 全部组件配置的列表
const componentConfigList: ComponentConfigType[] = [
    QuestionInputConfig,
    QuestionTitleConfig,
    ComponentParagraphConfig,
    ComponentInfoConfig,
    ComponentTextAreaConfig,
    ComponentRadioConfig,
    ComponentCheckboxConfig,
]

export const componentConfigGroup = [
    {
        groupId: 'textGroup',
        groupName: '文本显示',
        components: [QuestionTitleConfig, ComponentParagraphConfig, ComponentInfoConfig],
    },
    {
        groupId: 'inputGroup',
        groupName: '用户输入',
        components: [QuestionInputConfig, ComponentTextAreaConfig],
    },
    {
        groupId: 'chooseGroup',
        groupName: '用户选择',
        components: [ComponentRadioConfig, ComponentCheckboxConfig],
    },
]

export function getComponentConfigByType(type: string) {
    return componentConfigList.find(c => c.type === type)
}
